<template>
    <div style="margin-bottom: 24px;">
        <TitleTips :title="title">
            <template slot="button">
                <BaseButton style="position: absolute; right: 10px;" plain @click="handleAdd">新增子目</BaseButton>
            </template>
        </TitleTips>
        <BaseTable :columns="columns" :data="tableList">
            <template #handle="{ scope: { $index } }">
                <BaseButton type="text" color="danger" @click="handleDelete($index)">移除</BaseButton>
            </template>
        </BaseTable>
        <ChildSaveOrUpdate :id="id" ref="childDialog" :type="type" :list="tableList" @success="handleSuccess"></ChildSaveOrUpdate>
    </div>
</template>

<script>
import reconfirm from '@/utils/reconfirm'
import ChildSaveOrUpdate from './ChildSaveOrUpdate.vue'

export default {
    name: 'InventoryTable',
    components: {
        ChildSaveOrUpdate,
    },
    props: {
        type: {
            type: Number,
            default: 1 // type=1:普通工程量清单；type=2:计日工
        },
        id: {
            type: [Number, String],
            default: '' // 合同id
        },
    },
    data() {
        return {
            title: '',
            tableList: [],
            columns: Object.freeze([
                {
                    attrs: {
                        prop: 'number',
                        label: '序号',
                        width: '70',
                        type: 'index'
                    }
                },
                {
                    attrs: {
                        prop: 'chapterSequenceName',
                        label: this.type === 1 ? '章次' : '分类',
                        width: '100'
                    }
                },
                {
                    attrs: {
                        prop: 'parentCode',
                        label: '上级清单子目编码',
                        width: '160',
                        'show-overflow-tooltip': true
                    }
                },
                {
                    attrs: {
                        prop: 'parentName',
                        label: '上级清单子目名称',
                        width: '160',
                        'show-overflow-tooltip': true
                    }
                },
                {
                    attrs: {
                        prop: 'listSubitemCode',
                        label: '清单子目编码',
                        width: '180',
                        'show-overflow-tooltip': true
                    }
                },
                {
                    attrs: {
                        prop: 'listSubitemName',
                        label: '清单子目名称',
                        width: '180',
                        'show-overflow-tooltip': true
                    }
                },
                {
                    attrs: {
                        prop: 'unitSymbol',
                        label: '单位',
                        width: '90',
                        'show-overflow-tooltip': true
                    }
                },
                {
                    attrs: {
                        prop: 'quantity',
                        label: '暂估数量',
                        width: '100',
                        'show-overflow-tooltip': true
                    }
                },
                {
                    attrs: {
                        prop: 'price',
                        label: '单价（元）',
                        width: '120',
                        'show-overflow-tooltip': true
                    }
                },
                {
                    attrs: {
                        prop: 'amount',
                        label: '合价（元）',
                        width: '160',
                        'show-overflow-tooltip': true
                    }
                },
                {
                    attrs: {
                        prop: 'remark',
                        label: '备注',
                        'min-width': '150',
                        'show-overflow-tooltip': true
                    }
                },
                {
                    slot: 'handle',
                    attrs: {
                        label: '操作',
                        width: '140',
                        fixed: 'right'
                    }
                }
            ])
        }
    },
    created () {
        // 处理下名称
        if (this.type === 1) {
            this.title = '工程量清单'
        }
        if (this.type === 2) {
            this.title = '计日工清单'
        }
    },
    methods: {
        handleSuccess(data) {
            console.log(data)
            this.tableList.unshift(data)
        },
        handleAdd(row) {
            this.$refs['childDialog'].open()
        },
        handleDelete(index) {
            reconfirm({
                isPromise: false,
                text: '是否删除当前数据',
                callback: () => {
                    this.tableList.splice(index, 1)
                }
            })
        }
    }
}
</script>

<style lang="scss" scoped>

</style>
